<template lang="pug">
	view
		view.search(@click="gotoSearch" style="margin:20rpx;")
			u-search(placeholder="搜索产品"  shape="round" :clearabled="true" :showAction="false"  v-model="search" )
		u-notice-bar(:text="adverText" mode="closable")
		u-swiper.lunbo(:list="lunbo" keyName="image" showTitle :autoplay="true" circular)
		u-sticky.stickyback
			u-tabs.tabs( itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;" :activeStyle="{color: '#303133',fontWeight: 'bold',transform: 'scale(1.05)'}" :list="tabs" @click="tabsClick")
				view(slot="right" style="padding-left: 4px;" @tap="$u.toast('被点击')")
					u-icon(size="24" name="list" bold)
		view.shopList
			u-grid(border col="2")
					u-grid-item.shopItem(v-for="(listItem,listIndex) in commoditys" :key="listItem.id" @click="goCommodity(listIndex)")
							u--image( :showLoading="true" :src="listItem.imgurl" mode="widthFix" width="120" height="100")
							text.grid-text.shopname {{listItem.name}}
							u-row
								text.priceText ￥{{listItem.price}}
		u-empty(v-if="commoditys.length < 1" mode="list"  icon="http://cdn.uviewui.com/uview/empty/list.png")
</template>

<script >
	import {requestImg} from "../../util/Route.js"
	export default{	
		data(){
			return{
				adverText: '',
				Rimgurl:'http://47.102.203.158:2001/commodity/',
				listLength:0,
				current:-1,
				search : '',
				tabs : [],
				commoditys : [],
				lunbo:[{
						image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
						title: '奸商大特惠，买到就是亏到',
					},{
						image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
						title: '一起狂欢'
					},{
						image: 'https://cdn.uviewui.com/uview/swiper/swiper3.png',
						title: '大特惠大特惠'
					}],
					
					
			}
		},
		methods:{
			/**
			 * 
			 *  获取广告 
			 **/
			getAdver(){
				uni.$u.http.get('/advers').then(res=>{
					console.log(res.data);
					if(res.data.code ===200){
						for(let i=0;i<res.data.data.length;i++){
							this.adverText += "   "+res.data.data[i].content
						}
						
						
					}
					
				})
			},
			goCommodity(value){
				uni.navigateTo({
					url:'/pages/commodity/commodity?cid='+this.commoditys[value].cid
				})
			},
			tabsClick(value){
				this.current = value.typeid
				this.getcommoditys(value.typeid)
			},
			gotoSearch(){
				uni.navigateTo({
					url:"../search/search"
				})
			},
			getTabs(){
				uni.$u.http.get('/types').then(res=>{
				
					this.tabs = res.data.data
					this.tabs.unshift({
						typeid:-1,
						name:'全部'
					})
					
				})
			},
			getcommoditys(typeid){
				
				let Url = '/commoditys?'
				
				if(typeid !== -1){
					Url+='typeid='+ typeid
				}
				uni.$u.http.get(Url).then(res=>{
					this.commoditys = res.data.data
					this.listLength = this.commoditys.length
					
					for (let i = 0; i < this.commoditys.length; i++) {
						let zz = this.commoditys[i].imgurl 
						 this.commoditys[i].imgurl =this.Rimgurl+zz
					}
					if(typeid == -1){
						uni.$u.randomArray(this.commoditys)
					}
					
				})
			}
		},
		onPullDownRefresh(){
			console.log(this.current);
			this.getcommoditys(this.tabs[this.current].typeid)
		
			uni.stopPullDownRefresh()
		},
		onLoad() {
			this.getAdver()
			this.getTabs()
			this.getcommoditys(-1)
		},
		onShow(){
			this.getTabs()
			
		}
		
	}
</script>

<style scoped>
	.stickyback{
		background-color: #fff;
	}
	.priceText{
		font-weight: 600;
		
	}
	.shopname{
		font-size: 28rpx;
	}
	.lunbo{
		margin: 28rpx 30rpx;
	}
	.search{
		
	}
	.shopItem{
		padding: 20px;
	}
	.shopList{
		margin: 30px auto;
	}
	.tabs{
		background-color: #fff;
	}
</style>
